<html>
<head>
    <meta charset="UTF-8">
    <title></title>
    <style rel="stylesheet">

        div {
            display: inline-block;
        }

        input {
            margin-top: 5px;
            border: 1px solid lightskyblue;
            height: 30px;
            width: 195px;
            border-radius: 10px;
            margin-right: 10px;
            display: inline-block;
        }

        input:focus {
            outline: none;
            border: 2px solid lightskyblue;
        }

        #container {
            display: inline-block;
            left: 50%;
            position: fixed;
            margin-left: -310px;
            margin-top: 20px;
            font-size: 16px;
            font-family: 微软雅黑;
        }


        #buttondiv {
            display: block;
            position: relative;
            top: 20px;
            left: 300px;
        }

        #button {
            background: pink;
            font-size: 16px;
            font-family: 微软雅黑;
            border-radius: 10px;
            color: #7dc6ff;
            width: 102px;
        }

        #button:hover {
            color: #45a4fa;
            background: #ffbdc1;
            width: 110px;
            height: 40px;
            bottom: 10px;
            right: 5px;
            position: relative;

        }

        .old {
            position: relative;
            left: 48px;
        }

        #s {
            position: relative;
            top: 57px;
            right: 517px;
        }

        #si {
            width: 40px;
            font-size: 20px;
        }
    </style>

</head>
<body>
<form action="/con/test">
    <div id="container">


        <div>
            老数据库表名:<input type="text" name="oldTable">
            &nbsp;导入&nbsp;
            新数据库表名:<input type="text" name="newTable">
        </div>

        <div class="old" id="one" >
            老字段:<input type="text" name="old1">
            &nbsp;导入&nbsp;
            <span style="margin-left: 48px">
                新字段:<input type="text" name="new1">
            </span>
        </div>


        <div id="s">
            <input id="si"  type="button" value="+" onclick="give();">
        </div>
        <div id="buttondiv">
            <input id="button" type="submit"  value="确定" />
        </div>
    </div>
</form>

<script src="jquery.min.js"></script>
<script>
    var s = 2;
    function give() {
        var str = " <br/><div class=\"old\" id=\"one\" >\n" +
            "老字段:<input type=\"text\" name=\"old"+s+"\">\n" +
            "&nbsp;导入&nbsp;\n" +
            "<span style=\"margin-left: 48px\">  新字段:<input type=\"text\" name=\"new"+s+"\"></span>\n" +
            "</div>";
        $("#s").before(str);
        s++;
    }
</script>
</body>
</html>